<template>
	<view class="batch-manage-container">
    <view class="list-box">
      <u-checkbox-group wrap active-color="#FBD220" @change="checkboxChange">
        <template v-for="(item, index) in list">
          <u-checkbox v-model="item.checked" :key="index" :name="item.name" shape="circle" class="checkbox-item">
            <view class="mid-item">
              <view class="box-top">
                <!-- 图片 -->
                <view class="box-left">
                  <image :src="item.picture_Path"></image>
                  <view v-show="item.added_Status === 1" class="zhez">已下架</view>
                </view>
                
                <!-- 右边文字信息 -->
                <view class="box-right">
                  <view class="box-name text-line2">{{item.goods_Name}}</view>
                  <view class="box-right-item">
                    <view class="text-line">
                      <text class="color-EB5C02 font-blod">￥{{item.price}}</text>
                    </view>
                    <view class="text-line">
                      <text>总销量：{{item.salesVolume}}</text>
                    </view>
                  </view>
                  <view class="box-right-item">
                    <view class="text-line">
                      <text>添加人：{{item.accountName}}</text>
                    </view>
                    <view class="text-line">
                      <text>库存：{{item.count}}元</text>
                    </view>
                  </view>
                </view>
              </view>
            </view>
          </u-checkbox>
        </template>
      </u-checkbox-group>
    </view>
    
    <!-- 底部固定的操作，删除，下架 -->
		<view class="footer flex flex-ai-c flex-jc-sb">
			<view class="footer-left">
        <label class="flex flex-ai-c" @click="checkedAll()">
          <i-icon
            :icon="checkedAllStatus ? 'icongouxuan':'icontuoyuan'"
            :type="checkedAllStatus ? 'multiple' : 'single'"
            size="40rpx"
            color="#999"
          ></i-icon>
          <text class="ml-20 font-34 color-333">全选</text>
        </label>
			</view>
			<view class="footer-right flex">
				<view class="f-item" @click="handleStatus(1)">删除</view>
				<view class="f-item" @click="handleStatus(0)">下架</view>
			</view>
		</view>

    <!-- 弹窗部分 -->
		<!-- 确认删除提示 -->
		<u-modal v-model="delShow" :mask-close-able="true" title="温馨提示" :title-style="{fontWeight: 'bold'}"
		 :show-confirm-button="false">
			<view class="slot-content" style="padding-bottom: 50rpx;">
				<view class="mod-tis">是否确认删除此商品？</view>
				<view class="mod-btn">
		      这里有两张图片
				</view>
			</view>
		</u-modal>
		
		<!-- 确认下架提示 -->
		<u-modal v-model="offShelfPopupShow" :mask-close-able="true" title="温馨提示" :title-style="{fontWeight: 'bold'}"
		 :show-confirm-button="false">
			<view class="slot-content" style="padding-bottom: 50rpx;">
				<view class="mod-tis">是否确认下架此商品？</view>
				<view class="mod-btn">
		      这里有两张图片
				</view>
			</view>
		</u-modal>
	</view>
</template>

<script src="./batchManage.js"></script>
<style lang="scss" src="./batchManage.scss"></style>
